{js:artTemplate}
<article class="module width_full">
	<header>
		<h3 class="tabs_involved">首页幻灯片</h3>
	</header>

	<ul class="tabs" name="menu1">
		<li id="li_1" class="active"><a href="javascript:select_tab('1');">PC端幻灯片</a></li>
		<li id="li_2"><a href="javascript:select_tab('2');">移动端幻灯片</a></li>
	</ul>
	<div class="module_content" id="table_box_1">
		<form action='{url:/seller/banner_update/form_index/pc}' method='post' enctype="multipart/form-data">
			<input type="hidden" name="type" value="pc">
			<table class="tablesorter clear" id='slide_box_pc'>
				<colgroup>
					<col width="280px" />
					<col width="280px" />
					<col width="280px" />
					<col width="150px" />
				</colgroup>

				<thead>
				<tr>
					<th>名称</th>
					<th>链接地址</th>
					<th>图片文件</th>
					<th>操作</th>
				</tr>
				</thead>

				<tbody></tbody>

				<tfoot>
				<tr>
					<td colspan="4">
						<input class="alt_btn" type="button" onclick="add_slide('pc');" value="新加一个">
					</td>
				</tfoot>

				<!--导航行模板-->
				<script type='text/html' id='slideTrTemplate_pc'>
					<tr>
						<td>
							<input type='text' name='banner_name[]' class='form-control' value='<%=name%>' pattern='required' />
						</td>
						<td>
							<input type='text' name='banner_url[]' class='form-control' value='<%=url%>' pattern='required' />
						</td>
						<td>
							<%if(img){%><img src="{url:}<%=img%>" width="150px" /><br /><%}%>
							<input type='file' name='banner_pic[]' class='form-control' />
							<input type="hidden" value="<%=img%>" name="banner_img[]" />
						</td>
						<td>
							<a href="javascript:;"><i class='operator fa fa-arrow-up' alt='向上' title='向上' ></i></a>
							<a href="javascript:;"><i class='operator fa fa-arrow-down' alt='向下' title='向下'></i></a>
							<a href="javascript:;"><i class='operator fa fa-close' alt='删除' title='删除'></i></a>
						</td>
					</tr>
				</script>
			</table>
		<footer>
			<div class="submit_link">
				<input type="submit" class="alt_btn" value="保 存" />
				<input type="reset" value="重 置" />
			</div>
		</footer>
		</form>
	</div>

	<div class="module_content" id="table_box_2" style="display:none;">
		<form action='{url:/seller/banner_update/form_index/mobile}' method='post' enctype="multipart/form-data">
			<input type="hidden" name="type" value="mobile">
			<table class="tablesorter clear" id='slide_box_mobile'>
				<colgroup>
					<col width="280px" />
					<col width="280px" />
					<col width="280px" />
					<col width="150px" />
				</colgroup>

				<thead>
				<tr>
					<th>名称</th>
					<th>链接地址</th>
					<th>图片文件</th>
					<th>操作</th>
				</tr>
				</thead>

				<tbody></tbody>

				<tfoot>
				<tr>
					<td colspan="4">
						<input class="alt_btn" type="button" onclick="add_slide('mobile');" value="新加一个">
					</td>
				</tfoot>

				<!--导航行模板-->
				<script type='text/html' id='slideTrTemplate_mobile'>
					<tr>
						<td>
							<input type='text' name='banner_name[]' class='form-control' value='<%=name%>' pattern='required' />
						</td>
						<td>
							<input type='text' name='banner_url[]' class='form-control' value='<%=url%>' pattern='required' />
						</td>
						<td>
							<%if(img){%><img src="{url:}<%=img%>" width="150px" /><br /><%}%>
							<input type='file' name='banner_pic[]' class='form-control' />
							<input type="hidden" value="<%=img%>" name="banner_img[]" />
						</td>
						<td>
							<a href="javascript:;"><i class='operator fa fa-arrow-up' alt='向上' title='向上' ></i></a>
							<a href="javascript:;"><i class='operator fa fa-arrow-down' alt='向下' title='向下'></i></a>
							<a href="javascript:;"><i class='operator fa fa-close' alt='删除' title='删除'></i></a>
						</td>
					</tr>
				</script>
			</table>
			<footer>
				<div class="submit_link">
					<input type="submit" class="alt_btn" value="保 存" />
					<input type="reset" value="重 置" />
				</div>
			</footer>
		</form>
	</div>
</article>
<script type='text/javascript'>
//tab标签切换
function select_tab(curr_tab)
{
	$(".module_content").hide();
	$("#table_box_"+curr_tab).show();
	$("ul[name=menu1] > li").removeClass('active');
	$('#li_'+curr_tab).addClass('active');
}
//DOM加载完毕
$(function(){
    //生成幻灯片
    {if:$bannerData = Api::run('getBannerConf',$this->seller['seller_id'])}
    var slideList = {echo:JSON::encode($bannerData)};
    for(var index in slideList)
    {
        add_slide(slideList[index]['type'],slideList[index]);
    }
    {/if}

    var typeArr = ['pc','mobile'];
    for(var index in typeArr)
    {
        if ($('#slide_box_'+typeArr[index]+' tbody tr').size() == 0){
            add_slide(typeArr[index]);
        }
    }

    //初始化标签页面
    {if:IReq::get('form_index') == 'mobile'}
        select_tab(2)
    {/if}
 });

//增加幻灯片
function add_slide(type,data)
{
    var data = data ? data : {};
    var slideTrHtml = template.render('slideTrTemplate_'+type,data);
    $('#slide_box_'+type+' tbody').append(slideTrHtml);
    var last_index = $('#slide_box_'+type+' tbody tr').size()-1;
    buttonInit(last_index,'#slide_box_'+type);
}

//操作按钮绑定
function buttonInit(indexValue,ele)
{
    ele = ele || "#guide_box";
    if(indexValue == undefined || indexValue === '')
    {
        var button_times = $(ele+' tbody tr').length;

        for(var item=0;item < button_times;item++)
        {
            buttonInit(item,ele);
        }
    }
    else
    {
        var obj = $(ele+' tbody tr:eq('+indexValue+') .operator')

        //功能操作按钮
        obj.each(
            function(i)
            {
                switch(i)
                {
                    //向上排序
                    case 0:
                    {
                        $(this).click(
                            function()
                            {
                                var insertIndex = $(this).parent().parent().parent().prev().index();
                                if(insertIndex >= 0)
                                {
                                    $(ele+' tbody tr:eq('+insertIndex+')').before($(this).parent().parent().parent());
                                }
                            }
                        )
                    }
                    break;

                    //向上排序
                    case 1:
                    {
                        $(this).click(
                            function()
                            {
                                var insertIndex = $(this).parent().parent().parent().next().index();
                                $(ele+' tbody tr:eq('+insertIndex+')').after($(this).parent().parent().parent());
                            }
                        )
                    }
                    break;

                    //删除排序
                    case 2:
                    {
                        $(this).click(
                            function()
                            {
                                var obj = $(this);
                                art.dialog.confirm('确定要删除么？',function(){obj.parent().parent().parent().remove()});
                            }
                        )
                    }
                    break;
                }
            }
        )
    }
}
</script>